<!DOCTYPE html>
<html>
    <head>
        <title>TAI-Perfil</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link rel="stylesheet" href="../css/Perfil.css" type="text/css" media="screen">
        <!--Libreria modernizr para compatibilidad con css3 y html5-->
        <script src="../../2_Controlador/modernizr.2.5.3.js"></script>
        <script src="http://code.jquery.com/jquery-latest.js"></script>


            <link rel="stylesheet" href="../UserInterface/themes/base/jquery.ui.all.css">
          
            <script src="../UserInterface/ui/jquery.ui.core.js"></script>
            <script src="../UserInterface/ui/jquery.ui.widget.js"></script>
            <script src="../UserInterface/ui/jquery.ui.progressbar.js"></script>


    </head>
    <body>
        <div id="cuerpo">
            <header>
                <div id="logo">
                    <div id="imagenLogo"></div>
                </div>
                <figure id="cuadroTitulo"> 
                    <h1>TUTOR ADAPTATIVO INTELIGENTE</h1>
                </figure>
            </header>
            <nav>
                 <ul id="menu">
                    <li><a href="Inicio.php">Inicio</a></li>
                    <li><a href="#">Ayuda</a>
                        <ul>
                            <li>
                                <a href="#">Enteros</a>
                                <ul>
                                    <li><a href="AyudaEnterosSuma.html">Suma</a></li>
                                    <li><a href="AyudaEnterosResta.html">Resta</a></li>
                                    <li><a href="AyudaEnterosMultiplicacion.html">Multiplicación</a></li>
                                    <li><a href="AyudaEnterosDivision.html">División</a></li>
                                 </ul>
                            </li>
                            <li>
                                <a href="#">Fraccionarios</a>
                                <ul>
                                    <li><a href="AyudaFraccionariosSuma.html">Suma</a></li>
                                    <li><a href="AyudaFraccionariosResta.html">Resta</a></li>
                                    <li><a href="AyudaFraccionariosMultiplicacion.html">Multiplicación</a></li>
                                    <li><a href="AyudaFraccionariosDivision.html">División</a></li>
                                </ul>
                            </li>
                            <li>
                                <a href="#">Decimales</a>
                                <ul>
                                    <li><a href="AyudaDecimalesSuma.html">Suma</a></li>
                                    <li><a href="AyudaDecimalesResta.html">Resta</a></li>
                                    <li><a href="AyudaDecimalesMultiplicacion.html">Multiplicación</a></li>
                                    <li><a href="AyudaDecimalesDivision.html">División</a></li>
                                </ul>
                            </li>
                        </ul>
                    </li>
                    <li><a href="Perfil.html">Perfil</a></li>
                </ul>
            </nav>
            <div id="contenedorColumnas">
                <table>
                    <tr id="nombreUsuario"><td><h2>JAIMITO</h2></td></tr>
                    <tr>
                        <td>
                            <div id="ranking">                            
                                <table>
                                    <tr><td><h3>RANKING</h3></td></tr>
                                    <tr><td>
                                        <table id="tablaRanking">
                                            <tr><td><p>Módulo</p></td><td><p>Puntaje</p></td></tr>
                                            <tr><td><p>Enteros</p></td><td><p>34pts</p></td></tr>
                                            <tr><td><p>Fraccionarios</p></td><td><p>36pts</p></td></tr>
                                            <tr><td><p>Decimales</p></td><td><p>14pts</p></td></tr>
                                        </table>
                                    </td></tr>
                                </table>
                            </div>
                        </td>
                        <td>
                            <div id="nivelActual">
                                <table>
                                    <tr><td><h3>NIVEL ACTUAL</h3></td></tr>
                                    <tr><td><p>Supersayayin!</p></td></tr>
                                    <tr><td><img id="imagenNivel" src="" /></td></tr>
                                </table>
                            </div>
                        </td>
                    </tr>
                </table>
                <table>
                    <tr><td><input type="submit" class="boton" id="btnSalir" value="Salir"/></td></tr>
                </table>
            </div>


    
    
    <style>
    .ui-progressbar-value { background-image: url(images/pbar-ani.gif); }
    </style>
    <script>
        var a = 1;
        dos();
        function dos(){
        setTimeout(uno, 100);
        }

        function uno(){

            if(a<99){    
            a = a + 1;
            }
            $(function() 
        {        
           $( "#progressbar" ).progressbar({
                      value: a + 1
                    });    });
            dos();

        }
                

        
    </script>

    <div class="demo">
    <div id="progressbar"></div>
    </div>
        
            <footer>
                <div id="pieDePagina">2012 - tai</div>
            </footer>
        </div>
    </body>
</html>
